@import "../config/var";

:root {
	--van-blue: @color-primary;
	--van-red: @color-danger;
	--van-green: @color-success;
	--van-orange: @color-warning;

	--van-tabbar-item-active-color: @color-primary;
	--van-radius-md: 7px;
}

* { word-break: break-all; }

body { background-color: @color-back; }

.text-primary { color: @color-primary; }
.text-success { color: @color-success; }
.text-danger { color: @color-danger; }
.text-warning { color: @color-warning; }
.text-purple { color: @color-purple; }
.text-gray { color: @color-gray; }
.text-gray-8F959E { color: @color-gray-8F959E; }
.text-black { color: @color-black; }

.bg-primary { background-color: @color-primary; }
.bg-card-back { background-color: @color-card-back; }

.text-left { text-align: left; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-justify { text-align: justify; }

.text-normal { font-weight: normal; }
.text-bold { font-weight: bold; }

.text-xs { font-size: 12px; }
.text-sm { font-size: 14px; }
.text-md { font-size: 16px; }
.text-df { font-size: 18px; }
.text-lg { font-size: 20px; }
.text-xl { font-size: 22px; }

.over-hide{ overflow: hidden; }

.m-vh{ min-height: 100vh; }


@layout-base: 5px;
.layout-for(@i) when (@i < 10) {
	.layout-for((@i + 1));
	@value: @i * @layout-base;
	.mt-@{i} { margin-top: @value; }
	.ml-@{i} { margin-left: @value; }
	.mb-@{i} { margin-bottom: @value; }
	.mr-@{i} { margin-right: @value; }

	.pt-@{i} { padding-top: @value; }
	.pl-@{i} { padding-left: @value; }
	.pb-@{i} { padding-bottom: @value; }
	.pr-@{i} { padding-right: @value; }
}
.layout-for(0);

.radius-sm { border-radius: 8px; }

.van-badge {
	white-space: nowrap;
}

.bar_title {
	font-size: 17px;
	font-weight: normal;
	color: #3D3D3D;
	display: flex;
	align-items: center;
	padding: 13px 0;
	.icon_line {
		display: inline-block;
		vertical-align: middle;
		width: 4px;
		height: 16px;
		background-color: @color-primary;
	}
	.title { padding-left: 8px; }
}
.card-header {
	padding: 15px 0;
	margin: 0;
	font-size: 16px;
	font-weight: normal;
	color: #000000;
  &.flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}
.card-container {
	background-color: #FAFAFA;
	border-radius: 7px;
	--van-cell-text-color: #999999;
	--van-cell-value-color: #000000;
  & + .card-container { margin-top: 10px; }
	.van-cell {
		background-color: transparent;
		padding: 10px 9px;
		.van-cell__value {
			flex: 2;
			.van-button {
				vertical-align: bottom;
			}
		}
		&.label-flex-sub {
			.van-cell__value {
				flex: 1;
			}
		}
		&:after{ display: none; }
	}

	&.flex {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 14px 0;
		>div {
			flex: 1;
			h3 { margin: 0; }
			p { margin: 0; }
		}
	}
}


.return_icon {
	position: fixed;
	right: 20px;
	bottom: 80px;
	font-size: 28px;
	transform: rotateY(180deg);
	width: 50px;
	height: 50px;
	border-radius: 50%;
	text-align: center;
	line-height: 50px;
	color: @color-primary;
	background-color: #fff;
	box-shadow: 0 0 10px #ddd;
	z-index: 100;
}

.search_bar {
	--van-search-padding: 0 15px;
	--van-search-background: transparent;
	--van-search-content-background: @color-white;

	padding-top: 15px;
	padding-bottom: 15px;
	background-color: #F6F7F8;
	.van-search__content {
		border-radius: 10px;
	}
}

.vol_create {
	width: 100vw;
	height: calc(var(--van-tabbar-height) + 130px);
	text-align: center;
	display: flex;
	justify-content: center;
	flex-direction: column;
	&>div{
		width: 50vw;
		margin: 0 auto;
	}
	&.foot {
		position: fixed;
		height: 100px;
		bottom: calc(var(--van-tabbar-height) + 30px);
		left: 0;
		z-index: 100;
	}
}

.select_speaker {
  .select_list {
    background-color: #f4f5f6;
    overflow: auto;
    &_box {
      border-top: 1px solid #ddd;
      display: flex;
      align-items: center;
      padding: 5px 10px 5px;
    }
    &_item {
      white-space: nowrap;
      padding: 3px 5px;
      background-color: var(--color-primary);
      border-radius: 4px;
      color: #fff;
      & + .select_list_item { margin-left: 10px; }
    }
  }
  .vol_meeting_list  {
    padding: 0;
    .van-cell {
      padding: 10px 15px;
      &.active{
        color: #fff;
        background-color: @color-primary;
        .van-cell__label { color: #fff; }
        .van-cell__value { color: #fff; }
      }
    }
  }
}
